
<template>
  <div class="userdetail" :style="moreDetailStyle">
    <el-dialog title="人员信息详情" :visible.sync="personDetailVisible" width="80%" append-to-body>
      <personInfo v-bind:personId='personId'></personInfo>
    </el-dialog>
    <el-dialog :title="LsPersonEditOrAdd+'临时授权'" :visible.sync="userTmpResVisible" width="1000px" append-to-body>
      <el-form :model="userTmpResForm" :rules="userTmpResFormRules" ref="userTmpResForm">
        <el-input placeholder="输入人员姓名或身份证号" v-model="keyword" class="treeinput" @keyup.enter.native="searchtmpres" style="margin:0;width:270px !important;"></el-input>
        <el-button type="primary" icon="el-icon-search" class="depttreebtn" @click="searchtmpres" style="margin:0 8px !important;">搜索</el-button>
        <div style="clear:both;padding-top:10px">
          <el-transfer class="transfer-class" :titles='["备选","已选"]' v-model="selectperson" :data="personlist">
          </el-transfer>
        </div>
        <el-form-item label="授权时间（不填写为无限期）" prop="daterange" style="width:400px;clear:both">
          <el-date-picker v-model="userTmpResForm.daterange" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" >
          </el-date-picker>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click.native="userTmpResVisible = false">取消</el-button>
        <el-button type="primary" @click.native="userTmpResFormSubmit" :loading="userTmpResFormLoading">保存</el-button>
      </div>
    </el-dialog>
    <h1 style="margin-top:0">
      {{loadingtext}}
    </h1>
    <div v-show="havedata">
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="基本信息、权限" name="jigouxinxi">
          <el-scrollbar :style="usereditformstyle">
            <el-form :model="userEditForm" label-width="170px" :rules="userEditFormRules" ref="userEditForm" style="padding:0 10px;" :inline="true" v-if='this.myuserid !== "0"&&this.myuserid !== ""'>
              <div style="margin:20px;font-weight:bolder">最近一次登录时间：{{userEditForm.Lasttime}} 最近一次登录IP：{{userEditForm.Lastip}}</div>
              <h2>基本信息</h2>
              <el-form-item label="用户名" prop="Username">
                <b>{{userEditForm.Username}}</b>
              </el-form-item>
              <div style="clear:both"></div>
              <el-form-item label="真实姓名" prop="Truename" style="width:400px;">
                <el-input v-model="userEditForm.Truename" auto-complete="off" style="width:217px;"></el-input>
              </el-form-item>
              <div style="clear:both"></div>
              <el-form-item label="所属部门" prop="Unitname">
                <el-select v-model="userEditForm.Unitname" placeholder="请选择部门" @change="changeunit">
                  <el-option v-for="(item,index) in deptoptions" :key="'info1-' + index" :label="item" :value="item"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="主管部门" prop="Managedep" v-show="showmanagedep">
                <el-select v-model="userEditForm.Managedep" placeholder="请选择部门" multiple style="width:400px">
                  <el-option v-for="(item,index) in managedepopthions" :key="index" :label="item" :value="item"></el-option>
                </el-select>
              </el-form-item>
              <div style="clear:both"></div>
              <el-form-item label="是否启用" prop="Enable" style="width:400px;">
                <el-radio-group v-model="userEditForm.Enable">
                  <el-radio label="启用"></el-radio>
                  <el-radio label="停用"></el-radio>
                </el-radio-group>
              </el-form-item>
              <div style="clear:both"></div>
              <el-form-item label="密码" prop="Password">
                <el-input v-model="userEditForm.Password" auto-complete="off" style="width:217px;" ></el-input> 如果填写密码将会重置
              </el-form-item>
              <div style="clear:both"></div>
              <el-form-item label="登录IP" prop="Remark">
                <el-input v-model="userEditForm.Remark" auto-complete="off" style="width:417px;" type="textarea" rows="5"></el-input>
              </el-form-item>
              <h2>用户权限</h2>
              <el-checkbox-group v-model="checkList">
                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">用户身份</span>
                  <el-radio-group v-model="userrole">
                    <el-radio :label="12" >司长</el-radio>
                    <el-radio :label="13" >副司长</el-radio>
                    <el-radio :label="14" >处长</el-radio>
                    <el-radio :label="15" >办事人员</el-radio>
                  </el-radio-group>
                </div>
                <!-- <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">总体</span>
                  <el-checkbox :label="roleNameToId('ROLE_admin')">
                    管理员
                    <el-tooltip content="可以进行所有操作" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div> -->
                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">基础信息模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_basicdata')">
                    扩展数据维护
                    <el-tooltip content="维护扩展的人员、机构相关数据" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>
                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">人事制度检索模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_zhidudata')">
                    数据维护
                    <el-tooltip content="对人事制度检索模块数据进行添加" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>
                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">干部考核模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_kaohe')">
                    干部考核
                    <el-tooltip content="对年底干部考核、‘一报告两评议’管理" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>
                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">干部选任模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_xuanren')">
                    干部选任
                    <el-tooltip content="参与运行干部选任" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>

                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">线索举报、干部处理模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_jubao')">
                    线索举报、干部处理模块管理员
                    <el-tooltip content="线索举报、干部处理模块管理员用户" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>

                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">优秀年轻干部模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_young')" @change="changeYoung">
                    优秀年轻干部模块
                    <el-tooltip content="优秀年轻干部模块初审、审查、查看权限" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                  <el-checkbox :label="roleNameToId('ROLE_youngadmin')" @change="changeYoungAdmin">
                    优秀年轻干部模块管理员
                    <el-tooltip content="优秀年轻干部模块管理员权限" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>
                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">统计填报模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_tianbao')">
                    统计填报
                    <el-tooltip content="下属单位填报" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                  <el-checkbox :label="roleNameToId('ROLE_jijianbianzhi')">
                    纪检机构编制人员统计（机构编制处、干部一、二、三处参与管理）
                    <el-tooltip content="纪检机构编制人员统计项目管理权限" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>
                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">资料下发模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_xiafa')">
                    资料下发
                    <el-tooltip content="资料下发给下属单位" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>
                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">民主生活会模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_shhadmin')">
                    民主生活会管理员
                    <el-tooltip content="民主生活会管理员" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>
                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">干部培训模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_training')">
                    干部培训管理员
                    <el-tooltip content="干部培训管理员" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>
                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">司内会议模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_meeting')">
                    司内会议管理员
                    <el-tooltip content="司内会议管理员" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>
                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">编制统计模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_zbbsmz')">
                    编制统计
                    <el-tooltip content="编制统计" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>
                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">职级晋升年限提示模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_jinsheng')">
                    职级晋升年限提示
                    <el-tooltip content="职级晋升年限提示" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>
                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">公开招聘模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_recruit')">
                    公开招聘管理员
                    <el-tooltip content="公开招聘管理员" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>
                <div class="module" v-if="ver==='dev'">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">岗位设置模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_post')">
                    岗位设置管理员
                    <el-tooltip content="岗位设置管理员" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>
                <div class="module" v-if="ver==='dev'">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">工资管理模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_salary')">
                    工资管理管理员
                    <el-tooltip content="工资管理管理员" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>
                <div class="module">
                  <span class="grouptitle" style="font-size:var(--size18) !important;">干部监督统计模块</span>
                  <el-checkbox :label="roleNameToId('ROLE_oversightadmin')">
                    干部监督统计管理员
                    <el-tooltip content="干部监督统计管理员" placement="top">
                      <i class="el-icon-info"></i>
                    </el-tooltip>
                  </el-checkbox>
                </div>
              </el-checkbox-group>

              <el-button type="primary" @click="userEdit" style="margin:20px 20px 50px 220px;" :loading="saveloading" :disabled="dicloading">保存</el-button>
            </el-form>
          </el-scrollbar>
        </el-tab-pane>
        <el-tab-pane label="查看编制数据权限" name="danweizhize">
          <el-input placeholder="输入关键字" v-model="filterTextBz" class="treeinput"></el-input>
          <el-tooltip class="item" :content="connecttipBz" placement="top">
            <el-button :type="connectbtntypeBz" icon="el-icon-connection" class="depttreebtn" @click="changeconnecttypeBz()"></el-button>
          </el-tooltip>
            <el-button type="primary" class="depttreebtn" @click="saverolebz()" :loading="bzsaveLoading">保存</el-button>
          <el-scrollbar class="depttree" :style="depttreestyle">
            <el-tree show-checkbox node-key="id"  :expand-on-click-node="false" :render-content="renderContent" class="filter-tree" :data="treedata1" :filter-node-method="filterNodeBz" ref="treeBz" empty-text="无数据" :props="myprops" :check-strictly="connecttypeBz"></el-tree>
          </el-scrollbar>
        </el-tab-pane>
        <el-tab-pane label="查看人员数据权限" name="zhishubianzhi">
          <el-input placeholder="输入关键字" v-model="filterText" class="treeinput"></el-input>
          <el-tooltip class="item" :content="connecttip" placement="top">
            <el-button :type="connectbtntype" icon="el-icon-connection" class="depttreebtn" @click="changeconnecttype()"></el-button>
          </el-tooltip>
            <el-button type="primary" class="depttreebtn" @click="saveroleperson()" :loading="personsaveLoading">保存</el-button>
          <el-scrollbar class="depttree" :style="depttreestyle">
            <el-tree show-checkbox node-key="id"  :expand-on-click-node="false" :render-content="renderContent" class="filter-tree" :data="treedata1" :filter-node-method="filterNode" ref="tree3" empty-text="无数据" :props="myprops" :check-strictly="connecttype"></el-tree>
          </el-scrollbar>
        </el-tab-pane>
        <el-tab-pane label="查看人员数据临时授权" name="gangweirenyuan">
          <el-button type="primary" @click="addUserTmpRes()" style="margin:10px">新增临时授权</el-button>
          <el-table :data="lsPersonList" highlight-current-row v-loading="tableListLoading" style="width: 100%;" :height="tableHeight" border>
            <el-table-column type="index" label=" " width="50" fixed align="center" class-name="tableth">
            </el-table-column>
            <el-table-column label="授权人员">
              <template slot-scope="scope">
                <div v-for="(item, index) in scope.row.perids" :key="index" keys>
                  <el-button size="small" @click="persondetail(scope.row.perids[index])" type="text" icon="el-icon-search" style="float:left;padding-right:20px;"><span style="color:#0058AC;font-weight:bolder">{{scope.row.pernames[index]}}</span></el-button>
                </div>
              </template>
            </el-table-column>
            <el-table-column label="授权时间" width="270">
              <template slot-scope="scope">
                <div v-if="scope.row.outdate" style="color:red">
                  <div v-if="scope.row.dateto">
                    {{MyGetDateStr(scope.row.datefrom)}} 至 {{MyGetDateStr(scope.row.dateto)}}（已过期）
                  </div>
                </div>
                <div v-else style="color:green">
                  <div v-if="scope.row.dateto">
                    {{MyGetDateStr(scope.row.datefrom)}} 至 {{MyGetDateStr(scope.row.dateto)}}
                  </div>
                  <div v-else>无限制</div>
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="fromusername" label="操作用户" width="100">
            </el-table-column>
            <el-table-column label="操作" width="150">
              <template slot-scope="scope">
                <el-button size="small" @click="editUserTmpRes(scope.row.id)" type="text" icon="el-icon-edit">修改</el-button>
                <el-button size="small" @click="delUserTmpRes(scope.row.id)" type="text" icon="el-icon-delete">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>

<script>
import personInfo from '@/person/Detail.vue'
// import qs from 'qs'
export default {
  components: {
    personInfo
  },
  name: 'HelloWorld',
  watch: {
    timestamp: {
      handler (val) {
        console.log('子组件单位id：' + val)
        this.loadingtext = '正在加载中，请稍后...'
        if (this.myuserid && this.myuserid !== '') {
          this.getUser(this.myuserid)
        }
        this.setheight(this)
      },
      immediate: true
    },
    filterText (val) {
      this.$refs.tree3.filter(val)
    },
    filterTextBz (val) {
      this.$refs.treeBz.filter(val)
    }
    // $refs.tree2.getCurrentNode()
  },
  props: {
    myuserid: '',
    timestamp: ''
  },
  data () {
    return {
      ver: '',
      dicloading: true,
      keyword: '',
      userTmpResFormLoading: false,
      personlist: [],
      selectperson: [],
      userTmpResVisible: false,
      lsPersonList: [],
      tableListLoading: false,
      havedata: false,
      filterText: '',
      filterTextBz: '',
      userTmpResForm: {
        daterange: [],
        selectperson: []
      },
      userTmpResFormRules: {
      },
      userEditFormRules: {
        Truename: [
          { required: true, message: '请输入真实姓名', trigger: 'blur' }
        ]
      },
      myprops: {
        isLeaf: 'isLeaf'
      },
      checkList: [],
      post: [],
      moreDetailStyle: 'height:0px',
      depttreestyle: 'height:0px',
      usereditformstyle: 'height:0px',
      deptid: '',
      mypersonid: '',
      showpersonVisible: false,
      loadingtext: '选择左侧树中用户查看用户信息',
      depteditVisible: false,
      depteditBtnsVisible: false,
      bzfenleioptions: {},
      bzshenfenoptions: {},
      bzzhiwuoptions: {},
      totalnum: 0,
      mydeptinfo: {},
      activeName: 'jigouxinxi',
      activeName0: 'jigouxinxi',
      editLoading: false,
      bzlistLoading: false,
      bz: [],
      deptlistLoading: false,
      dept: [],
      total: 0,
      page: 1,
      pagenum: 5,
      deptCurrentRow: '',
      mydeptEdit: false,
      listLoading: false,
      Isace: true,
      Sortkey: '',
      userEditForm: {
        Truename: '',
        Unitname: '',
        Managedep: [],
        Enable: '',
        Roles: [],
        Password: '',
        Remark: ''
      },
      saveloading: false,
      roleoptions: [],
      deptoptions: [],
      managedepopthions: [],
      showmanagedep: false,
      treedata1: [],
      connectbtntype: 'danger',
      connectbtntypeBz: 'danger',
      connecttip: '树节点切换为不联动模式',
      connecttipBz: '树节点切换为不联动模式',
      connecttype: false,
      connecttypeBz: false,
      personsaveLoading: false,
      bzsaveLoading: false,
      personId: '',
      personDetailVisible: false,
      editLsPersonId: '',
      LsPersonEditOrAdd: '新增',
      userrole: '',
      tableHeight: 100,
      DicRoles: []
      // rolesEnabled: true
    }
  },
  methods: {
    changeYoungAdmin (val) {
      if (val) {
        if (this.checkList.indexOf(this.roleNameToId('ROLE_young')) === -1) {
          this.checkList.push(this.roleNameToId('ROLE_young'))
        }
      }
    },
    changeYoung (val) {
      if (!val) {
        if (this.checkList.indexOf(this.roleNameToId('ROLE_youngadmin')) > -1) {
          this.checkList = this.checkList.filter(item => item !== this.roleNameToId('ROLE_youngadmin'))
        }
      }
    },
    roleNameToId (rolename) {
      console.log(rolename)
      let obj = this.DicRoles.find(item => item.Name === rolename)
      if (obj) {
        console.log(obj.Id)
        return obj.Id
      }
    },
    // 取消选任角色同时不允许选择司长、副司长、处长、处内人员等角色
    // changeXuanren () {
    //   if (this.checkList.indexOf(16) > -1) {
    //     this.rolesEnabled = true
    //   } else {
    //     this.userrole = ''
    //     this.rolesEnabled = false
    //   }
    // },
    changeunit () {
      console.log('切换')
      if (this.userEditForm.Unitname === '司领导') {
        console.log('切换至司领导')
        this.showmanagedep = true
        this.userEditForm.Managedep = []
      } else {
        this.showmanagedep = false
        this.userEditForm.Managedep = []
      }
    },
    delUserTmpRes (id) {
      var _this = this
      this.$confirm('确认删除该记录吗?', '提示', {
        type: 'warning'
      }).then(() => {
        let para = {
          username: this.userEditForm.Username,
          id: id
        }
        this.$http.post(`/admin/removeusertmpres`, para).then(function (response) {
          if (response.data.success === true) {
            _this.$message({
              message: '删除成功',
              type: 'success'
            })
          } else {
            console.log('删除失败:' + response.data.message)
            _this.$message({
              message: '删除失败:' + response.data.message,
              type: 'error'
            })
          }
          _this.getLsPersonList(_this.userEditForm.Username)
        })
      })
    },
    persondetail (id) {
      this.personDetailVisible = true
      this.personId = id
    },
    userTmpResFormSubmit () {
      var _this = this
      this.$refs.userTmpResForm.validate((valid) => {
        if (valid) {
          if (this.selectperson.length > 0) {
            this.userTmpResFormLoading = true
            let para = {}
            let url = ''
            let datefrom = null
            let dateto = null
            if (this.userTmpResForm.daterange !== null && this.userTmpResForm.daterange !== []) {
              datefrom = this.userTmpResForm.daterange[0]
              dateto = this.userTmpResForm.daterange[1]
            }
            if (this.editLsPersonId === 0) {
              para = {
                username: this.userEditForm.Username,
                datefrom: datefrom,
                dateto: dateto,
                perids: this.selectperson
              }
              url = `/admin/addusertmpres`
            } else {
              para = {
                id: this.editLsPersonId,
                username: this.userEditForm.Username,
                datefrom: datefrom,
                dateto: dateto,
                perids: this.selectperson
              }
              url = `/admin/editusertmpres`
            }
            // this.$http.post('/admin/edituserres', qs.stringify(para), {headers: {'Content-Type': 'application/x-www-form-urlencoded'}}).then(function (response) {
            this.$http.post(url, para).then(function (response) {
              console.log(response.data.success)
              if (response.data.success === true) {
                _this.$message({
                  message: '提交成功',
                  type: 'success'
                })
                _this.userTmpResFormLoading = false
                _this.userTmpResVisible = false
                _this.getLsPersonList(_this.userEditForm.Username)
              } else {
                console.log('提交失败:' + response.data.message)
                _this.$message({
                  message: '提交失败:' + response.data.message,
                  type: 'error'
                })
                _this.userTmpResFormLoading = false
              }
            }).catch(function (error) {
              console.log(error)
              _this.$message({
                message: '获取失败:' + error,
                type: 'error'
              })
              _this.userTmpResFormLoading = false
            })
          } else {
            _this.$message({
              message: '至少选择一个人员',
              type: 'error'
            })
          }
        }
      })
    },
    searchtmpres () {
      if (this.keyword === '') {
        this.$message({
          message: '姓名或身份证号不能为空',
          type: 'error'
        })
      } else {
        var _this = this
        let para = {
          key: this.keyword
        }
        this.$http
          .post('/binfo/persons/shortsearch', para)
          .then(function (response) {
            let newlist = [] // 新备选对象数组
            // 遍历原备选对象数组，并将已选对象添加至新备选数组
            _this.personlist.forEach(function (v) {
              if (_this.selectperson.indexOf(v.key) >= 0) {
                newlist.push(v)
              }
            })
            console.log('备选数量1：' + newlist.length)
            if (response.data !== []) {
            // 遍历搜索结果数组，并将搜索结果中未出现在已选id数组中的对象重新包装后，添加至新备选对象数组
              response.data.forEach(function (v) {
                if (_this.selectperson.indexOf(v.A0000) === -1) {
                  newlist.push({
                    key: v.A0000,
                    label: v.A0101 + '（身份证号：' + v.A0184 + '）'
                  })
                }
              })
            }
            // 将新备选对象数组绑定至控件
            _this.personlist = newlist
            console.log('已选数量：' + _this.selectperson.length)
            console.log('备选数量：' + _this.personlist.length)
          })
          .catch(function (error) {
            console.log(error)
            _this.$message({
              message: '网络获取失败:' + error,
              type: 'error'
            })
          })
      }
    },
    addUserTmpRes () {
      this.editUserTmpRes(0)
    },
    editUserTmpRes (id) {
      var _this = this
      this.personlist = []
      this.selectperson = []
      this.userTmpResForm.daterange = []
      this.keyword = ''
      if (id !== 0) {
        this.LsPersonEditOrAdd = '编辑'
        this.lsPersonList.forEach(function (v) {
          if (v.id === id) {
            let myLsPerson = Object.assign({}, v)
            if (myLsPerson.dateto) {
              _this.userTmpResForm.daterange.push(_this.MyGetDateStr(myLsPerson.datefrom))
              _this.userTmpResForm.daterange.push(_this.MyGetDateStr(myLsPerson.dateto))
            }
            _this.selectperson = myLsPerson.perids
            myLsPerson.perids.forEach(function (item, index) {
              _this.personlist.push({
                key: item,
                label: myLsPerson.pernames[index] + '（身份证号：' + myLsPerson.pernos[index] + '）'
              })
            })
          }
        })
      } else {
        this.LsPersonEditOrAdd = '新增'
      }
      this.editLsPersonId = id
      console.log('editLsPersonId:' + this.editLsPersonId)
      this.userTmpResVisible = true
    },
    saveroleperson () {
      this.personsaveLoading = true
      var _this = this
      console.log(this.$refs.tree3.getCheckedNodes(false, true))
      let checkedids = []
      let checkedobj = this.$refs.tree3.getCheckedNodes(false, true)
      for (let i in checkedobj) {
        checkedids.push(checkedobj[i].id)
      }
      console.log('checkedids:' + checkedids)
      let para = {
        username: this.userEditForm.Username,
        isperson: true,
        insids: null,
        perids: checkedids
      }
      // this.$http.post('/admin/edituserres', qs.stringify(para), {headers: {'Content-Type': 'application/x-www-form-urlencoded'}}).then(function (response) {
      this.$http.post(`/admin/edituserres`, para).then(function (response) {
        console.log(response.data.success)
        if (response.data.success === true) {
          _this.$message({
            message: '提交成功',
            type: 'success'
          })
          _this.personsaveLoading = false
        } else {
          console.log('提交失败:' + response.data.message)
          _this.$message({
            message: '提交失败:' + response.data.message,
            type: 'error'
          })
          _this.personsaveLoading = false
        }
      }).catch(function (error) {
        console.log(error)
        _this.$message({
          message: '获取失败:' + error,
          type: 'error'
        })
        _this.personsaveLoading = false
      })
    },
    saverolebz () {
      this.bzsaveLoading = true
      var _this = this
      let checkedids = []
      let checkedobj = this.$refs.treeBz.getCheckedNodes(false, true)
      for (let i in checkedobj) {
        checkedids.push(checkedobj[i].id)
      }
      console.log('checkedids:' + checkedids)
      let para = {
        username: this.userEditForm.Username,
        isperson: false,
        insids: checkedids,
        perids: null
      }
      // this.$http.post('/admin/edituserres', qs.stringify(para), {headers: {'Content-Type': 'application/x-www-form-urlencoded'}}).then(function (response) {
      this.$http.post(`/admin/edituserres`, para).then(function (response) {
        console.log(response.data.success)
        if (response.data.success === true) {
          _this.$message({
            message: '提交成功',
            type: 'success'
          })
          _this.bzsaveLoading = false
        } else {
          console.log('提交失败:' + response.data.message)
          _this.$message({
            message: '提交失败:' + response.data.message,
            type: 'error'
          })
          _this.bzsaveLoading = false
        }
      }).catch(function (error) {
        console.log(error)
        _this.$message({
          message: '获取失败:' + error,
          type: 'error'
        })
        _this.bzsaveLoading = false
      })
    },
    renderContent (h, { node, data, store }) {
      console.log('测试：' + this.value1)
      return (
        <span class="custom-tree-node" style="width:100%" title={data.title} >
          <i class={data.className} />
          <span style="line-height:28px">{node.label}</span>
        </span>
      )
    },
    changeconnecttype () {
      console.log('this.connecttype' + this.connecttype)
      if (this.connecttype) {
        this.connecttype = false
        this.connectbtntype = 'danger'
        this.connecttip = '树节点切换为不联动模式'
      } else {
        this.connecttype = true
        this.connectbtntype = 'infor'
        this.connecttip = '树节点切换为联动模式'
      }
    },
    changeconnecttypeBz () {
      if (this.connecttypeBz) {
        this.connecttypeBz = false
        this.connectbtntypeBz = 'danger'
        this.connecttipBz = '树节点切换为不联动模式'
      } else {
        this.connecttypeBz = true
        this.connectbtntypeBz = 'infor'
        this.connecttipBz = '树节点切换为联动模式'
      }
    },
    filterNode (value, data) {
      if (!value) return true
      return data.label.indexOf(value) !== -1
    },
    filterNodeBz (value, data) {
      if (!value) return true
      return data.label.indexOf(value) !== -1
    },
    getTree () {
      console.log('重新获取树')
      this.filterText = ''
      this.filterTextBz = ''
      var _this = this
      this.TreeLoading = true
      this.$http
        .get('/binfo/allins/')
        .then(function (response) {
          _this.TreeLoading = false
          console.log('获取成功')
          console.log(response.data)
          _this.treedata1 = response.data
        })
        .catch(function (error) {
          console.log(error)
          _this.$message({
            message: '网络获取失败:' + error,
            type: 'error'
          })
        })
    },
    getUser (val) {
      var _this = this
      this.loadingtext = '正在加载中，请稍后...'
      this.filterText = ''
      this.filterTextBz = ''
      this.userEditForm = {}
      this.dicloading = true // 加载字典前保存按钮不可用
      this.$http
        .get('/admin/user/' + val)
        .then(function (response) {
          _this.deptlistLoading = false
          _this.havedata = true
          console.log('UserName:' + response.data.User.Username)
          _this.userEditForm = response.data.User
          if (_this.userEditForm.Managedep && _this.userEditForm.Managedep !== '') {
            _this.userEditForm.Managedep = JSON.parse(_this.userEditForm.Managedep)
          }
          if (_this.userEditForm.Unitname === '司领导') {
            console.log('初始化为司领导')
            _this.showmanagedep = true
          } else {
            _this.showmanagedep = false
          }
          _this.$refs.tree3.setCheckedKeys([])
          _this.$refs.treeBz.setCheckedKeys([])
          _this.getDeptChecked(_this.userEditForm.Username)
          _this.getLsPersonList(_this.userEditForm.Username)
          _this.DicRoles = response.data.DicRoles
          _this.dicloading = false // 加载字典完成后保存按钮才可点击
          let Roles = []
          _this.userrole = ''
          if (response.data.Roles && response.data.Roles.length > 0) {
            for (let i = 0; i < response.data.Roles.length; i++) {
              if (response.data.Roles[i] > 11 && response.data.Roles[i] < 16) { // 用户身份
                _this.userrole = response.data.Roles[i]
              } else {
                Roles.push(response.data.Roles[i])
              }
            }
          }
          _this.checkList = Roles
          _this.ModuleList = []
          for (var i = 0; i < _this.DicRoles.length; i++) {
            if (i === 0 || _this.DicRoles[i].Modulename !== _this.DicRoles[i - 1].Modulename) {
              _this.ModuleList.push(_this.DicRoles[i].Modulename)
            }
          }
          _this.loadingtext = '用户信息（' + response.data.User.Username + '）'
          // _this.changeXuanren()
        })
        .catch(function (error) {
          console.log(error)
          _this.loadingtext = '网络获取失败'
          _this.$message({
            message: '网络获取失败',
            type: 'error'
          })
        })
    },
    getDept () {
      let para = {
        id: this.$route.params.id
      }
      var _this = this
      this.deptLoading = true
      this.$http
        .get(`/admin/depts`)
        .then(function (response) {
          console.log(para)
          _this.deptLoading = false
          console.log('获取成功')
          _this.deptoptions = response.data.filter(e => { return e !== '其他单位' })
          _this.managedepopthions = []
          for (let i = 0; i < response.data.length; i++) {
            if (response.data[i] !== '司领导') {
              _this.managedepopthions.push(response.data[i])
            }
          }
        })
        .catch(function (error) {
          console.log(error)
          _this.$message({
            message: '网络获取失败:' + error,
            type: 'error'
          })
        })
    },
    getDeptChecked (myusername) {
      let para = {
        username: myusername
      }
      var _this = this
      this.deptLoading = true
      this.$http
        .post(`/admin/userres`, para)
        .then(function (response) {
          console.log(para)
          _this.deptLoading = false
          console.log('获取成功')
          if (response.data.perids !== null) {
            _this.connecttype = true
            _this.$nextTick(() => {
              _this.$refs.tree3.setCheckedKeys(response.data.perids, false)
              _this.connecttype = false
            })
          }
          if (response.data.insids !== null) {
            _this.connecttypeBz = true
            _this.$nextTick(() => {
              _this.$refs.treeBz.setCheckedKeys(response.data.insids, false)
              _this.connecttypeBz = false
            })
          }
        })
        .catch(function (error) {
          console.log(error)
          _this.$message({
            message: '网络获取失败:' + error,
            type: 'error'
          })
        })
    },
    getLsPersonList (myusername) {
      let para = {
        username: myusername
      }
      var _this = this
      this.tableListLoading = true
      this.$http
        .post(`/admin/usertmpres`, para)
        .then(function (response) {
          console.log(para)
          _this.tableListLoading = false
          console.log('获取成功')
          _this.lsPersonList = response.data
        })
        .catch(function (error) {
          _this.tableListLoading = false
          console.log(error)
          _this.$message({
            message: '网络获取失败:' + error,
            type: 'error'
          })
        })
    },
    userEdit () {
      var _this = this
      this.$refs.userEditForm.validate((valid) => {
        if (valid) {
          if (this.userrole === '') {
            this.$message({
              message: '用户身份必填',
              type: 'error'
            })
          } else {
            this.saveloading = true
            let Roles = []
            for (let i = 0; i < this.checkList.length; i++) {
              Roles.push(this.checkList[i])
            }
            if (this.userrole !== '') {
              Roles.push(this.userrole)
            }
            console.log(Roles)
            let para = {
              Id: this.myuserid,
              Truename: this.userEditForm.Truename,
              Unitname: this.userEditForm.Unitname,
              Managedep: this.userEditForm.Managedep,
              Enable: this.userEditForm.Enable,
              Password: this.userEditForm.Password,
              Remark: this.userEditForm.Remark,
              Roles: Roles
            }
            this.$http.post(`/admin/edituser`, para).then(function (response) {
              if (response.data.success === true) {
                _this.$message({
                  message: '保存成功',
                  type: 'success'
                })
                _this.getTree()
                _this.saveloading = false
              } else {
                _this.$message({
                  message: '保存失败2:' + response.data.message,
                  type: 'error'
                })
                _this.saveloading = false
              }
            }).catch(function (error) {
              _this.$message({
                message: '保存失败3:' + error,
                type: 'error'
              })
              _this.saveloading = false
            })
          }
        }
      })
    },
    handleSizeChange (val) {
      this.pagenum = val
      this.getZhidu()
    },
    handleCurrentChange (val) {
      this.page = val
      this.getZhidu()
    },
    setheight (obj) {
      var clientHeight = 0
      if (document.body.clientHeight && document.documentElement.clientHeight) {
        clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight
      } else {
        clientHeight = (document.body.clientHeight > document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight
      }
      obj.moreDetailStyle = 'height:' + (clientHeight - 210) + 'px'
      obj.depttreestyle = 'height:' + (clientHeight - 245) + 'px'
      obj.usereditformstyle = 'height:' + (clientHeight - 185) + 'px'
      obj.tableHeight = clientHeight - 243
    },
    setCurrent (row) {
      this.$refs.xiashutable.setCurrentRow(row)
    },
    haverow () {
      if (this.mydeptinfo.MyChildren && this.deptCurrentRow) {
        for (var i = 0; i < this.mydeptinfo.MyChildren.length; i++) {
          if (this.mydeptinfo.MyChildren[i].id === this.deptCurrentRow.id) {
            return true
          }
        }
      }
      return false
    },
    chooserow () {
      if (this.mydeptinfo.MyChildren && this.deptCurrentRow) {
        console.log('测试是否执行')
        for (var i = 0; i < this.mydeptinfo.MyChildren.length; i++) {
          console.log(this.mydeptinfo.MyChildren[i])
          if (this.mydeptinfo.MyChildren[i].id === this.deptCurrentRow.id) {
            this.deptCurrentRow = this.mydeptinfo.MyChildren[i]
            this.$refs.xiashutable.setCurrentRow(this.deptCurrentRow)
          }
        }
      }
    },
    noticeparent () {
      this.$emit('treefreshevent', this.mydeptinfo.MyChildren)
    },
    noticeparentname (name) {
      this.$emit('treefreshnameevent', name)
    },
    dateFormat2: function (mydate) {
      const daterc = mydate
      if (daterc === undefined) {
        return ''
      }
      console.log(daterc)
      if (daterc != null) {
        const dateMat = new Date(daterc)
        const year = dateMat.getFullYear()
        const month = dateMat.getMonth() + 1
        const day = dateMat.getDate()
        const timeFormat = year + '-' + month + '-' + day
        return timeFormat
      }
    },
    handleClick (tab, event) {
    },
    searchPerson () {
      this.page = 1
      this.getPersons()
    },
    // 排序
    sortChange: function (column, prop, order) {
      this.Sortkey = column.prop
      if (column.order === 'ascending') {
        this.Isace = true
      } else {
        this.Isace = false
      }
      this.getPersons()
    }
  },
  mounted () {
    this.ver = document.querySelector('meta[name="ver"]').content
    this.getTree()
    this.getDept()
    let _this = this
    window.onresize = function windowResize () {
      // 通过捕获系统的onresize事件触发我们需要执行的事件
      _this.setheight(_this)
      console.log('test0:' + _this.moreDetailStyle)
    }
  }
}
</script>
<style>
#userdetail{
  overflow: hidden;
}
#userdetail .el-pagination{
  float: left;
  padding:7px 10px;
}
#userdetail h1{
  height: 30px;
  border-bottom: 1px solid #95B8E7;
  font-family: '宋体';
  line-height: 30px;
  font-size:var(--size14) !important;
  color: #000;
  padding-left:10px;
  background-image: linear-gradient(to bottom , #EEF4FF, #E0ECFF);
  margin-bottom:0;
}
#userdetail .el-tabs__header{
  height: 29px;
  background: #FAFAFA;
  line-height: 30px;
  font-family: '宋体';
  padding:0 20px;
  border-bottom: 2px solid #E4E7ED;
  margin:0;
}
#userdetail .el-tabs__item{
  line-height: 30px;
  height: 30px;
  font-weight:bolder;
}
#userdetail .mytable table{
  border-top: 1px solid #74A6CC;
  border-left: 1px solid #74A6CC;
  margin: 10px;
  width: calc(100% - 20px);
}
#userdetail .mytable th,
#userdetail .mytable td{
  padding: 10px;
  border-right: 1px solid #74A6CC;
  border-bottom: 1px solid #74A6CC;
  vertical-align:top;
  line-height: 150%;
}
#userdetail .mytable th{
  background:#C0DCF1;
}
#userdetail .el-table th{
    font-weight: normal;
    background-image: linear-gradient(to bottom , #f8f8f8, #efefef);
  }
#userdetail .el-table td, .el-table th{
    padding:0;
    font-size:var(--size14) !important;
    line-height: 20px;
    font-family: '宋体'
  }
  .tableth{
    background-image: linear-gradient(to bottom , #f8f8f8, #efefef);
  }
.bztable{
  text-align: center
}
#userdetail .bztable th{
  vertical-align:middle;
}
#userdetail .detailinfotable th{
  width:200px;
}
.zhize{
  line-height: 200%;
}
#userdetail .depttreebtn{
  padding:12px 12px 12px 12px !important
}
#userdetail .depttree{
  clear: both;
}
.transfer-class .el-transfer-panel{
  clear: both;
  border: 1px solid #409EFF;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
  display: inline-block;
  vertical-align: middle;
  width: 350px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  height: 350px;
}
.transfer-class .el-transfer-panel .el-transfer-panel__header{
  /* background:#409EFF; */
  /* color:#fff; */
  border-bottom:1px solid #409EFF;
}
/* .transfer-class .el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label{
  color:#fff;
}
.transfer-class .el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label span{
  color:#fff;
}
.transfer-class .el-transfer-panel .el-transfer-panel__empty{
  color:#000;
} */
/* #userdetail .transfer-class div:nth-child(3) .el-transfer-panel__filter{
  display:none
} */
</style>
